<template>
  <div class="wrap">
    <el-card class="header-card">
      <div class="item">
        <p>{{ $t('table.store') }}：{{ data.accountName }}</p>
        <p>{{ $t('table.调货单号') }}：{{ data.workNo }}</p>
        <p v-if="data.labelOrder">{{ $t('table.贴标单号') }}：{{ data.labelOrder.labelNo }}</p>
        <p class="">{{ $t('table.工单状态') }}：{{ getTransferStatusStr(data.status) }}</p>
        <p class="">{{ $t('table.工单类型') }}：{{ getTransferTypeStr(data.type) }}</p>
        <p class="" v-if="data.labelOrder">{{ $t('table.贴标状态') }}：{{ getMiddleLabelStatusStr(data) }}</p>
        <p>
          <span>{{ $t('table.createTime2') }}：{{ data.createTime }}</span>
          <span class="mgl20" v-if="data.finishTime">{{ $t('table.完成时间') }}：{{ data.finishTime }}</span>
        </p>
        <p>{{ $t('table.箱子数量') }}：{{ data.boxNum }}</p>
        <p>
          {{ $t('table.预计调货SKU（种）') }}: {{ data.exSkuNum }}
          <span class="mgl20" v-if="data.status === 2">{{ $t('table.实际调货SKU（种）') }}: {{ data.exSkuNum }}</span>
        </p>
        <p>
          {{ $t('table.预计调货商品总数') }}: {{ data.exGoodsNum }}
          <span class="mgl20" v-if="data.status === 2">{{ $t('table.实际调货商品总数') }}: {{ data.rlGoodsNum }}</span>
        </p>
<!--        <p>
          <span>{{ $t('table.预计调货费用（元）') }}：{{ data.exTotalTransferFee }}</span>
          <span class="mgl20" v-if="data.status === 2">{{ $t('table.实际调货费用（元）') }}：{{ data.rlTotalTransferFee }}</span>
        </p>
        <p v-if="data.labelOrder">
          <span>{{ $t('table.预计贴SKU标费用（元）') }}：{{ data.labelOrder.exTotalLabelFee }}</span>
          <span class="mgl20" v-if="data.labelOrder.status === 2">{{ $t('table.实际贴SKU标费用（元）') }}：{{ data.labelOrder.rlTotalLabelFee }}</span>
        </p>
        <p>
          <span>{{ $t('table.预计总费用（元）') }}：{{ data.exTotalFee }}</span>
          <span class="mgl20" v-if="data.status === 2">{{ $t('table.实际总费用（元）') }}：{{ data.rlTotalFee }}</span>
        </p> -->
        <p v-if="data.child_id != '' && data.child_id != 0 && data.child_id != null">
          <span>操作员：{{ data.child_name }}</span>
        </p>
        <p v-else>
          <span>操作员：{{ data.userAccount }}</span>
        </p>
      </div>
      <div class="button">
        <div v-if="data.labelOrder">
          <el-button type="primary" @click="jumpLabelOrderInfo(data.labelOrder.id, true)">{{ $t('labelOrder.贴标工单') }}</el-button>
        </div>
      </div>
    </el-card>

    <div class="mgt20">
      <h4>{{ $t('middle.费用信息') }}</h4>
      <el-table :data="exFee" border style="width: 100%">
        <el-table-column prop="exTransferFee" label="调货费用（元)" min-width="180" align="center">
          <template>
            <span v-if="data.status === 2" class="font-green">{{ data.rlTotalTransferFee }}</span>
            <span v-else>{{ data.exTotalTransferFee }}</span>
          </template>
        </el-table-column>
        <el-table-column v-if="data.labelOrder" prop="exTotalFee" label="贴SKU标费用（元)" min-width="180" align="center">
          <template>
            <span class="mgl20" v-if="data.labelOrder.status === 2">{{ data.labelOrder.rlTotalTransferFee }}</span>
            <span v-else>{{ data.labelOrder.exTotalLabelFee  }}</span>
          </template>
        </el-table-column>

        <el-table-column prop="exTotalFee" :label="$t('table.总费用（元）')" min-width="180" align="center">
          <template>
            <span v-if="data.status === 2" style="margin-left: 10px">{{ data.rlTotalFee }}</span>
            <span v-else style="margin-left: 10px">{{ data.exTotalFee }}</span>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <div>
      <!-- <div v-if="straightGoods.length > 0">
        <h4>{{ $t('transfer.无需贴标调货商品详细情况') }}：</h4>
        <el-table :data="straightGoods" row-key="id" border style="width: 1700px">
          <el-table-column :label="$t('table.productCover')" align="center" width="120" fixed="left">
            <template slot-scope="{ row }">
              <div class="img-box img-one">
                <img :src="row.image" alt="" />
              </div>
            </template>
          </el-table-column>
          <el-table-column :label="$t('table.title')" align="left" min-width="300">
            <template slot-scope="{ row }">
              {{ row.title }}
              <div class="goods-SKU-info">
                <span v-for="attr in row.attributes" :key="attr.name" class="attr">
                  {{ attr.name }} : {{ attr.value }}
                  <span class="attr-link">|</span>
                </span>
              </div>
            </template>
          </el-table-column>
          <el-table-column :label="$t('table.当前店铺的Listing ID与SKU')" align="left" min-width="300">
            <template slot-scope="{ row }">{{ row.goodsId }}{{ row.sku ? `(${row.sku})` : '' }}</template>
          </el-table-column>
          <m-l-code-column></m-l-code-column>
          <el-table-column :label="$t('table.调出店铺Listing ID与SKU')" align="left" min-width="300" v-if="false">
            <template slot-scope="{ row }">{{ row.goodsId }}{{ row.sku ? `(${row.sku})` : '' }}</template>
          </el-table-column>
          <template v-if="data.type === 2">
            <el-table-column :label="$t('table.预计从一件代发调出')" align="center" width="200" prop="exGoodsNum">
              <template v-slot="{ row }">
                <div v-for="(item, index) in row.stockBoxInfo" :key="index">{{ $t('table.num/箱', { num: item.goodsNumInBox }) }} × {{ item.editNum }}</div>
              </template>
            </el-table-column>
          </template>
          <template v-if="data.type === 1">
            <el-table-column :label="$t('table.预计从中转送仓调出')" align="center" width="200" prop="exGoodsNum">
              <template v-slot="{ row }">
                <div v-for="(item, index) in row.middleBoxInfo" :key="index">{{ $t('table.num/箱', { num: item.goodsNumInBox }) }} × {{ item.editNum }}</div>
              </template>
            </el-table-column>
          </template>
          <el-table-column :label="$t('table.预计调入商品总数量')" align="center" width="200" prop="exTotalGoodsNum">
            <template v-slot="{ row }">
              <template v-if="data.type === 1">
                {{ calGoodsNum(row.middleBoxInfo) }}
              </template>
              <template v-else>
                {{ calGoodsNum(row.middleBoxInfo) + calGoodsNum(row.stockBoxInfo) }}
              </template>
            </template>
          </el-table-column>
          <template v-if="data.status === 2">
            <el-table-column :label="$t('table.实际调入商品总数')" align="center" width="200" prop="rlGoodsNum">
              <template v-slot="{ row }">
                <span :class="[row.rlGoodsNum !== row.exGoodsNum ? 'font-red' : '']">{{ row.rlGoodsNum }}</span>
              </template>
            </el-table-column>
          </template>
          <template v-else>
            <el-table-column :label="$t('table.operate')" align="center" width="200" v-if="false">
              <template v-slot="{ row }">
                <el-button type="warning" @click="showDialog(row)">{{ $t('middle.修改调货库存') }}</el-button>
              </template>
            </el-table-column>
          </template>
        </el-table>
      </div> -->

      <div v-if="GoodsList.length > 0">
        <!-- <h4>{{ $t('transfer.需贴标调货商品详细情况') }}：</h4> -->
        <h4>调货商品详情：</h4>
        <el-table :data="GoodsList" row-key="id" border :span-method="objectSpanMethod1">
          <el-table-column :label="$t('table.productCover')" align="center" width="120" fixed="left" prop="image">
            <template slot-scope="{ row }">
              <div class="img-box img-one">
                <img :src="row.image" alt="" />
              </div>
            </template>
          </el-table-column>
          <el-table-column :label="$t('table.title')" align="left" min-width="300" prop="title">
            <template slot-scope="{ row }">
              {{ row.title }}
              <div class="goods-SKU-info">
                <span v-for="attr in row.attributes" :key="attr.name" class="attr">
                  {{ attr.name }} : {{ attr.value }}
                  <span class="attr-link">|</span>
                </span>
              </div>
            </template>
          </el-table-column>
          <el-table-column :label="$t('table.当前店铺的Listing ID与SKU')" align="left" min-width="300" prop="toGoodsId">
            <template slot-scope="{ row }">{{ row.goodsId }}{{ row.sku ? `(${row.sku})` : '' }}</template>
          </el-table-column>
          <!-- <m-l-code-column></m-l-code-column> -->
          <el-table-column label="产品标" align="left" min-width="200" prop="fromGoodsId">
            <template v-slot="{ row }">
              <template v-if="row.fromGoodsIsTB">
                {{ $t('shipment.Not labeled') }}
              </template>
              <template v-else-if="row.fromGoodsIsSystem">{{ row.sku }}</template>
              <template v-else>{{ row.inventoryId ? `${row.inventoryId}` : '' }}</template>
            </template>
          </el-table-column>
          <!-- <m-l-code-column prop="fromInventoryId" :label="$t('table.调货MLCode')"></m-l-code-column> -->
          <template v-if="data.type === 2">
            <el-table-column :label="$t('table.预计从一件代发调出')" align="center" width="200" prop="exOneStock">
              <template v-slot="{ row }">
                <template v-if="row.stockBoxInfo.length === 0">-</template>
                <template v-else>
                  <div v-for="(item, index) in row.stockBoxInfo" :key="index">{{ $t('table.num/箱', { num: item.goodsNumInBox }) }} × {{ item.editNum }}</div>
                </template>
              </template>
            </el-table-column>
          </template>
          <template v-else>
          <el-table-column :label="$t('table.预计从中转送仓调出')" align="center" width="200" prop="exOneStock">
            <template v-slot="{ row }">
              <template v-if="row.middleBoxInfo.length === 0">-</template>
              <template v-else>
                <div v-for="(item, index) in row.middleBoxInfo" :key="index">{{ $t('table.num/箱', { num: item.goodsNumInBox }) }} × {{ item.editNum }}</div>
              </template>
            </template>
          </el-table-column>
          </template>
        <!--  <template v-if="data.type === 2 && data.status === 2">
            <el-table-column :label="$t('table.实际从一件代发调出')" align="center" width="200" prop="rlOneStock"></el-table-column>
          </template>
          <template v-if="data.status === 2">
            <el-table-column :label="$t('table.实际从中转送仓调出')" align="center" width="200" prop="rlMiddleStock"></el-table-column>
          </template> -->

          <el-table-column :label="$t('table.预计调入商品总数量')" align="center" width="200" prop="exTotalGoodsNum">
            <template v-slot="{ row }">
              <template v-if="data.type === 1">
                {{ calGoodsNum(row.middleBoxInfo) }}
              </template>
              <template v-else>
                {{ calGoodsNum(row.middleBoxInfo) + calGoodsNum(row.stockBoxInfo) }}
              </template>
            </template>
          </el-table-column>
          <template v-if="data.status === 2">
            <el-table-column :label="$t('table.实际调入商品总数')" align="center" width="200" prop="rlTotalGoodsNum">
              <template v-slot="{ row }">
                <span :class="row.exTotalGoodsNum === row.rlTotalGoodsNum ? '' : 'font-red'">{{ row.rlTotalGoodsNum }}</span>
                  <!-- {{getRlTotalGoodsNum(row)}} -->
              </template>
            </el-table-column>
          </template>

          <!--   已确认之后不能再修改库存   -->
          <template v-if="data.status <= 1">
            <el-table-column :label="$t('table.operate')" align="center" width="200" prop="operate" v-if="false">
              <template v-slot="{ row }">
                <el-button type="warning" @click="showDialog(row)">{{ $t('middle.修改调货库存') }}</el-button>
              </template>
            </el-table-column>
          </template>
        </el-table>
      </div>
    </div>

    <div class="remark">
      <h4>{{ $t('shipment.step4Text10') }}：</h4>
      <el-input type="textarea" style="width: 1500px" :placeholder="$t('shipment.step4Text11')" v-model="data.remark"></el-input>
    </div>

    <el-dialog :title="$t('transfer.库存调货')" :visible.sync="dialog" width="1400px">
      <div style="margin-top: -20px">
        <div class="mgb10 font-bold">{{ $t('transfer.请选择填写从哪个库存中调出') }}</div>
        <el-table :data="otherGoodsList" row-key="id" border>
          <el-table-column :label="$t('table.ListingIDAndSKU')" align="left" min-width="300" show-overflow-tooltip>
            <template slot-scope="{ row }">
              <template v-if="row.isGoods">{{ row.goodsId }}{{ row.sku ? `(${row.sku})` : '' }}</template>
              <template v-else-if="row.isTB">
                {{ $t('shipment.Not labeled') }}
              </template>
              <template v-else-if="row.isSystem">{{ $t('shipment.System label') }}（{{ row.sku }}）</template>
            </template>
          </el-table-column>
          <m-l-code-column></m-l-code-column>
          <template v-if="data.type === 2">
            <el-table-column :label="$t('table.一件代发库存')" align="center" width="200" prop="stockNum"></el-table-column>
            <el-table-column :label="$t('table.调出代发库存')" align="center" width="200" prop="transferStockNum">
              <template v-slot="{ row }">
                <el-input-number :step="1" :precision="0" :min="0" :max="row.stockNum" :disabled="row.stockNum === 0" v-model="row.transferStockNum"></el-input-number>
              </template>
            </el-table-column>
          </template>

          <el-table-column :label="$t('table.中转送仓库存')" align="center" width="200" prop="middleStockNum"></el-table-column>
          <el-table-column :label="$t('table.调出中转库存')" align="center" width="200" prop="transferMiddleStockNum">
            <template v-slot="{ row }">
              <el-input-number
                :step="1"
                :precision="0"
                :min="0"
                :max="row.middleStockNum"
                :disabled="row.middleStockNum === 0 || (row.id === dialogGoods.toSuitListId && data.type === 2)"
                v-model="row.transferMiddleStockNum"
              ></el-input-number>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialog = false">{{ $t('common.cancel') }}</el-button>
        <el-button type="primary" @click="addGoodsData">{{ $t('common.confirm') }}</el-button>
      </div>
    </el-dialog>

    <div class="mgt20">
      <el-button @click="jumpPage('transferList')">{{ $t('common.back') }}</el-button>
      <el-button type="primary" @click="editGoodsNum" v-if="data.status <= 1" :loading="editLoading">{{ $t('common.confirmModification') }}</el-button>
      <template v-if="data.status <= 2 && (!data.labelOrder || data.labelOrder.status !== 2)">
        <delete-button :id="data.id" @deleteWork="jumpPage('transferList')"></delete-button>
      </template>
    </div>
  </div>
</template>

<script>
import UploadGoodsLabel from '@/views/stock/components/UploadGoodsLabel';
import { confirmLabelOrder, editLabelOrder, getLabelOrderInfo } from '@/api/labelOrder';
import { deepCopy } from '@/utils';
import { jumpLabelOrderInfo, jumpPage, jumpShipmentInfo } from '@/utils/jumpView';
import { editMiddleWork, getMiddleInfo } from '@/api/middleWork';
import UploadBoxPDF from '@/views/middleWork/components/UploadBoxPDF.vue';
import CancelButton from '@/views/middleWork/components/CancelButton';
import ReturnCancelButton from '@/views/middleWork/components/ReturnCancelButton';
import { getTransferInfo, updateTransferData } from '@/api/transferWork';
import DeleteButton from '@/views/transferWork/components/DeleteButton.vue';
import { getTransferStatus, getTransferStatusStr, getTransferTypeStr } from '@/utils/transferWork';
import { getMiddleLabelStatusStr } from '@/utils/MiddleWork';
import MLCodeColumn from '@/views/stock/components/MLCodeColumn.vue';

export default {
  name: 'middleInfo',
  components: { MLCodeColumn, DeleteButton },
  computed: {

    otherGoodsList() {
      return this.dialogGoods.otherGoods.filter((item) => {
        if (this.dialogGoods.isDistribution === 0 && item.suitListId === this.dialogGoods.toSuitListId) {
          return true;
        }
        if (this.dialogGoods.isDistribution === 1 && item.suitListId !== this.dialogGoods.toSuitListId) {
          if (this.data.type === 2) {
            return true;
          }
          if (this.data.type === 1 && item.isTB) {
            return true;
          }
        }
        return false;
      });
    }
  },
  data() {
    return {
      id: 0,
      loading: false,
      data: {},
      straightGoods: [], // 无需调货的商品
      distributionGoodsList: [], // 需要调货的商品
      originDistribution: [], // 原来的数据 用于记录是否有改变数据
      apiOtherGoodsList: [], // 接口返回的数据

      dialog: false,
      dialogGoods: {
        otherGoods: []
      },
      exFee: [{ exTotalFee: 0, exTotalLabelFee: 0, exTransferFee: 0 }],
      editLoading: false,
      GoodsList:[],
    };
  },
  created() {
    this.id = this.$route.query.id;
    this.getData();
  },
  methods: {
    getMiddleLabelStatusStr,
    getTransferTypeStr,
    getTransferStatusStr,
    jumpLabelOrderInfo,
    jumpPage,
    getData() {
      this.loading = true;
      getTransferInfo(this.id).then((res) => {
        this.loading = false;
        this.data = res.data;
        this.straightGoods = res.data.straightGoods;
        this.GoodsList=res.data.GoodsList
        this.distributionGoodsList = res.data.distributionGoods;
        this.originDistribution = deepCopy(this.distributionGoodsList);
      });
    },
    // 修改库存
    showDialog(row) {
      this.dialog = true;
      this.dialogGoods = deepCopy(row);
    },
    // 修改库存
    chooseDistribution(row) {
      this.distributionDialog = true;
      this.distributionGoods = row;
    },
    addGoodsData() {
      // 不需要调货的商品
      const goodsList = this.dialogGoods.isDistribution === 0 ? this.straightGoods : this.distributionGoodsList;
      goodsList.some((someItem) => {
        if (someItem.id === this.dialogGoods.id) {
          someItem.otherGoods.forEach((otherGoods) => {
            this.otherGoodsList.some((_otherGoods) => {
              if (_otherGoods.id === otherGoods.id) {
                otherGoods.transferMiddleStockNum = _otherGoods.transferMiddleStockNum;
                otherGoods.transferStockNum = _otherGoods.transferStockNum;
                return true;
              }
            });
          });

          someItem.exMiddleStock = someItem.otherGoods.reduce((prev, cur) => {
            return prev + cur.transferMiddleStockNum;
          }, 0);
          someItem.exOneStock = someItem.otherGoods.reduce((prev, cur) => {
            return prev + cur.transferStockNum;
          }, 0);

          someItem.exGoodsNum = someItem.otherGoods.reduce((prev, cur) => {
            return prev + (cur.transferStockNum + cur.transferMiddleStockNum);
          }, 0);
          someItem.exTotalGoodsNum = someItem.exGoodsNum;

          return true;
        }
      });

      this.dialog = false;
    },
    objectSpanMethod1({ row, column, rowIndex, columnIndex }) {
      const mergeCell = this.mergeCell1();
      if (mergeCell[column.property]) {
        if (mergeCell[column.property][rowIndex]) {
          return [mergeCell[column.property][rowIndex], 1];
        } else {
          // 如果为0则为需要合并的行
          return [0, 0];
        }
      }
    },

    mergeCell1() {
      const mergeObj = {};
      // 根据suitId合并的字段
      const mergeFieldArr = ['image', 'title', 'toGoodsId'];

      mergeFieldArr.forEach((key) => {
        mergeObj[key] = [1];
      });

      let mergeFieldKey = 0;
      this.GoodsList.forEach((item, index) => {
        // 第一列数据不处理
        if (index === 0) {
          return;
        }
        // 根据suitId 合并
        if (item.toSuitListId && item.toSuitListId === this.GoodsList[index - 1].toSuitListId) {
          mergeFieldArr.forEach((key) => {
            mergeObj[key][mergeFieldKey] += 1;
            mergeObj[key].push(0); // 添加一个0 站位
          });
        } else {
          mergeFieldKey = index; // 记录当前行
          mergeFieldArr.forEach((key) => {
            mergeObj[key].push(1); // 添加一个1
          });
        }
      });
      return mergeObj;
    },
    // 根据当前的数据 组装提交表单的数据
    createFinishGoodsData() {
      // 先清空数据
      const postObj = {
        straightGoodsList: [],
        distributionGoodsList: []
      };

      this.straightGoods.forEach((item) => {
        const obj = deepCopy(item);
        delete obj.otherGoods;

        const otherGoods = deepCopy(item.otherGoods);
        otherGoods.forEach((otherGoods) => {
          if (otherGoods.suitListId === item.toSuitListId) {
            const newObj = deepCopy(obj);
            newObj.fromId = otherGoods.id;
            newObj.fromIsGoods = otherGoods.isGoods;
            newObj.fromIsSystem = otherGoods.isSystem;
            newObj.fromIsTB = otherGoods.isTB;
            newObj.transferStockNum = otherGoods.transferStockNum; // 需要调货一件代发库存
            newObj.transferMiddleStockNum = otherGoods.transferMiddleStockNum; // 需要调货中转库存
            newObj.fromMiddleStockNum = otherGoods.middleStockNum;
            newObj.fromStockNum = otherGoods.stockNum;
            newObj.fromOgAccountId = otherGoods.ogAccountId;
            newObj.fromSuitId = otherGoods.suitId;
            newObj.fromSuitListId = otherGoods.suitListId;
            newObj.fromGoodsId = otherGoods.goodsId;
            newObj.fromVariationId = otherGoods.variationId;
            newObj.fromSku = otherGoods.sku;

            postObj.straightGoodsList.push(newObj);
          }
        });
      });

      const handleSuitListId = []; // 用于记录已经处理的id
      this.distributionGoodsList.forEach((item) => {
        // 当前这个商品的属性
        const obj = deepCopy(item);
        const otherGoods = deepCopy(item.otherGoods);

        delete obj.otherGoods;
        if (handleSuitListId.indexOf(item.suitListId) !== -1) {
          return;
        }
        handleSuitListId.push(item.suitListId);

        // 先排序数据 把商品数据放在前面非商品数据放在后面
        otherGoods.forEach((otherGoods) => {
          if (!(otherGoods.transferMiddleStockNum > 0 || otherGoods.transferStockNum > 0)) {
            return;
          }
          const newObj = deepCopy(obj);
          newObj.fromId = otherGoods.id;
          newObj.fromIsGoods = otherGoods.isGoods;
          newObj.fromIsSystem = otherGoods.isSystem;
          newObj.fromIsTB = otherGoods.isTB;
          newObj.transferStockNum = otherGoods.transferStockNum; // 需要调货一件代发库存
          newObj.transferMiddleStockNum = otherGoods.transferMiddleStockNum; // 需要调货中转库存
          newObj.fromMiddleStockNum = otherGoods.middleStockNum;
          newObj.fromStockNum = otherGoods.stockNum;
          newObj.fromOgAccountId = otherGoods.ogAccountId;
          newObj.fromSuitId = otherGoods.suitId;
          newObj.fromSuitListId = otherGoods.suitListId;
          newObj.fromGoodsId = otherGoods.goodsId;
          newObj.fromVariationId = otherGoods.variationId;
          newObj.fromSku = otherGoods.sku;

          postObj.distributionGoodsList.push(newObj);
        });
      });

      return postObj;
    },
    editGoodsNum() {
      const postData = this.createFinishGoodsData();
      postData.id = this.data.id;
      postData.remark = this.data.remark;
      this.$confirm(this.$t('middle.修改后，您需要重新确认贴标工单'), {
        title: this.$t('middle.确定修改当前工单？')
      })
        .then(() => {
          this.editLoading = true;
          updateTransferData(postData).then((res) => {
            this.editLoading = false;
            if (res.error === 0) {
              this.$successMessage(res.message);
              this.getData();
            } else {
              this.$errorMessage(res.message);
            }
          });
        })
        .catch(() => {
          this.editLoading = false;
        });
    },
    // 预计调入商品总数量
    getRlTotalGoodsNum(row){
      return this.GoodsList.filter(goods => goods.toSuitListId === row.toSuitListId)
        .reduce((prev,cur)=>{
          return prev +cur.rlGoodsNum
        },0)
    },
    // 计算商品数量
    calGoodsNum(arr) {
      return arr.reduce((prev, cur) => {
        return prev + cur.editNum * cur.goodsNumInBox;
      }, 0);
    }
  }
};
</script>

<style scoped lang="scss">
.wrap {
  padding: 30px 30px;
  .header {
    //display: flex;
    //justify-content: space-between;
  }
  .content {
    padding: 20px 0 0;
  }
  .header-card {
    font-size: 14px;
    background-color: rgba(242, 242, 242, 1);
    p {
      margin: 10px 0;
      padding: 0;
    }
    .font-bold {
      font-weight: bold;
    }
    .true-number {
      color: #ff0000;
      font-weight: 600;
    }
  }
}
.goods-table {
  width: 1500px;
  .goods-title {
    font-size: 14px;
  }
  .goods-attr {
    font-size: 13px;
    color: #7f7f7f;
  }
}
.table-tips {
}

.header-card {
  position: relative;
  .button {
    position: absolute;
    display: flex;
    flex-direction: column;
    right: 20px;
    top: 30px;
  }
}
.box-content {
  font-size: 15px;
}
</style>
